@extends('admin.layout._back')

@section('content-header')
<style>
    .layui-upload-img{width: 92px; height: 92px; margin: 0 10px 10px 0;}
</style>
@parent
<link rel="stylesheet" type="text/css" href="/uploadify/uploadify.css" />
<h1>
    内容管理
    <small>文章</small>
</h1>
<ol class="breadcrumb">
    <li><a href="{{ site_url('dashboard', 'admin') }}"><i class="fa fa-dashboard"></i> 主页</a></li>
    <li><a href="{{ _route('admin:article.index') }}">内容管理 - 文章</a></li>
    <li class="active">撰写新文章</li>
</ol>
@stop

@section('content')

@if(session()->has('fail'))
<div class="alert alert-warning alert-dismissable">
    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
    <h4><i class="icon icon fa fa-warning"></i> 提示！</h4>
    {{ session('fail') }}
</div>
@endif

@if($errors->any())
<div class="alert alert-danger alert-dismissable">
    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
    <h4><i class="icon fa fa-ban"></i> 警告！</h4>
    <ul>
        @foreach ($errors->all() as $error)
        <li>{{ $error }}</li>
        @endforeach
    </ul>
</div>
@endif

<h2 class="page-header">撰写新文章</h2>
<form method="post" action="{{ _route('admin:article.store') }}" accept-charset="utf-8"
      class="layui-form layui-form-pane">
    {!! csrf_field() !!}
    <div class="nav-tabs-custom">
        <ul class="nav nav-tabs">
            <li class="active"><a href="#tab_1" data-toggle="tab" aria-expanded="true">主要内容</a></li>
        </ul>
        <div class="layui-form-item"></div>
        <div class="layui-form-item">
            <label class="layui-form-label">标题</label>
            <div class="layui-input-block">
                <input type="text" name="title" autocomplete="off" placeholder="请输入标题" class="layui-input">
            </div>
        </div>
        <div class="layui-upload">
            <label class="layui-form-label">标题</label>
            <button type="button" class="layui-btn" id="test1">上传图片</button>
            <div class="layui-upload-list" style="margin:10px 110px">
                <img class="layui-upload-img" id="demo1">
                <p id="demoText"></p>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>

    </div>
</form>
<div id="layerPreviewPic" class="fn-hide">

</div>

@stop
@section('extraPlugin')

<!--引入Layer组件-->
<script src="{{ _asset(ref('layer.js')) }}"></script>
<!--引入iCheck组件-->
<script src="{{ _asset(ref('icheck.js')) }}" type="text/javascript"></script>
<!--引入My97DatePicker日期插件-->
<script src="{{ _asset(ref('my97datepicker.js')) }}" type="text/javascript"></script>

<!--引入Chosen组件-->
@include('admin.scripts.endChosen')

<script>
    layui.use('upload', function(){
        var $ = layui.jquery
            ,upload = layui.upload;
        //普通图片上传
        var uploadInst = upload.render({
            elem: '#test1'
            ,url: '/uploadify/uploaad.php'
            ,before: function(obj){
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    $('#demo1').attr('src', result); //图片链接（base64）
                });
            }
            ,done: function(res){
                //如果上传失败
                if(res.code > 0){
                    return layer.msg('上传失败');
                }
                //上传成功
            }
            ,error: function(){
                //演示失败状态，并实现重传
                var demoText = $('#demoText');
                demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');
                demoText.find('.demo-reload').on('click', function(){
                    uploadInst.upload();
                });
            }
        });
    })
</script>
@stop

